<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<div th:fragment="commentCard (username,content)">
    <div>
        <span> </span>
        <span>${username}</span>
    </div>
    <div style="margin-left: 30px;">
        <span th:text='${content}'></span>
    </div>

    '<div class="CommentItemV2-footer" style="margin-bottom: 10px">'+
            '<button type="button" class="Button CommentItemV2-likeBtn Button--plain">'+
                   '     <span style="display: inline-flex; align-items: center;margin-left: 50px;">​'+
                       '     <svg class="Zi Zi--Like" fill="currentColor" viewBox="0 0 24 24" width="16" height="16" style="margin-right: 5px;">'+
                         '       <p ath d="M14.445 9h5.387s2.997.154 1.95 3.669c-.168.51-2.346 6.911-2.346 6.911s-.763 1.416-2.86 1.416H8.989c-1.498 0-2.005-.896-1.989-2v-7.998c0-.987.336-2.032 1.114-2.639 4.45-3.773 3.436-4.597 4.45-5.83.985-1.13 3.2-.5 3.037 2.362C15.201 7.397 14.445 9 14.445 9zM3 9h2a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V10a1 1 0 0 1 1-1z" fill-rule="evenodd"></path>'+
                       '     </svg>'+
                   '     </span> 赞'+
           ' </button>'+
          '  <button type="button" class="Button CommentItemV2-hoverBtn Button--plain">'+
           '             <span style="display: inline-flex; align-items: center;margin-left: 10px;">​'+
            '                <svg class="Zi Zi--Reply" fill="currentColor" viewBox="0 0 24 24" width="16" height="16" style="margin-right: 5px;">'+
             '                   <path d="M22.959 17.22c-1.686-3.552-5.128-8.062-11.636-8.65-.539-.053-1.376-.436-1.376-1.561V4.678c0-.521-.635-.915-1.116-.521L1.469 10.67a1.506 1.506 0 0 0-.1 2.08s6.99 6.818 7.443 7.114c.453.295 1.136.124 1.135-.501V17a1.525 1.525 0 0 1 1.532-1.466c1.186-.139 7.597-.077 10.33 2.396 0 0 .396.257.536.257.892 0 .614-.967.614-.967z" fill-rule="evenodd"></path>'+
           '                 </svg>'+
            '            </span>'+
         '       <span class="response" th:onclick="|response(${answerList.id})|">回复</span>'+
          '  </button>'+
         '   <button type="button" class="Button CommentItemV2-hoverBtn Button--plain">'+
          '              <span style="display: inline-flex; align-items: center;margin-left: 10px;">​'+
         '                   <svg class="Zi Zi--Like" fill="currentColor" viewBox="0 0 24 24" width="16" height="16" style="transform: rotate(180deg); margin-right: 5px;">'+
          '                      <path d="M14.445 9h5.387s2.997.154 1.95 3.669c-.168.51-2.346 6.911-2.346 6.911s-.763 1.416-2.86 1.416H8.989c-1.498 0-2.005-.896-1.989-2v-7.998c0-.987.336-2.032 1.114-2.639 4.45-3.773 3.436-4.597 4.45-5.83.985-1.13 3.2-.5 3.037 2.362C15.201 7.397 14.445 9 14.445 9zM3 9h2a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V10a1 1 0 0 1 1-1z" fill-rule="evenodd"></path>'+
          '                  </svg>'+
           '             </span>'+
            '    踩'+
           ' </button>'+
          '  <button type="button" class="Button CommentItemV2-hoverBtn Button--plain">'+
           '             <span style="display: inline-flex; align-items: center;margin-left: 10px;">​'+
            '                <svg class="Zi Zi--Report" fill="currentColor" viewBox="0 0 24 24" width="16" height="16" style="margin-right: 5px;">'+
           '                     <path d="M19.947 3.129c-.633.136-3.927.639-5.697.385-3.133-.45-4.776-2.54-9.949-.888-.997.413-1.277 1.038-1.277 2.019L3 20.808c0 .3.101.54.304.718a.97.97 0 0 0 .73.304c.275 0 .519-.102.73-.304.202-.179.304-.418.304-.718v-6.58c4.533-1.235 8.047.668 8.562.864 2.343.893 5.542.008 6.774-.657.397-.178.596-.474.596-.887V3.964c0-.599-.42-.972-1.053-.835z" fill-rule="evenodd"></path>'+
         '                   </svg>'+
          '              </span>'+
         '       举报'+
        '    </button>'+
       ' </div>'+
'</div>'